$pageColor: #ff8a00;

* {
    margin: 0;
    padding: 0;
}

html {
    font-size: 100px;
}

body {
    width: 100vw;
    height: 100vh;
    overflow-x: hidden;
    // -ms-grid-layer: #f7f7f7;
    background-color: #F5F5F5;
}
li{
    list-style: none;
}

a{
    text-decoration: none;
    color: white;
}
header{
    width: 100vw;
    height: 2rem;
    background-image: url(../image/my/bg1.png);
    background-size: cover;
    position: relative;
    div{
        font-size: .14rem;
        color:white;
        line-height: .6rem;
    }
    .my{
        height: .5rem;
        position: absolute;
        top: .1rem;
        right: .5rem;
        background-image: url(../image/my/urse.png);
        background-repeat: no-repeat;
        background-size: .15rem;
        background-position: .05rem 0;
    }
    .download{
        height: .5rem;
        position: absolute;
        top: .1rem;
        right: .15rem;
        background-image: url(../image/my/down.png);
        background-repeat: no-repeat;
        background-size: .15rem;
        background-position: .05rem 0;
    }
    .user{
        width: .5rem;
        line-height: 2rem;
        margin-left: 50%;
        transform: translateX(-50%);
    }
    button{
        width: .75rem;
        height: .35rem;
        color: white;
        background-color: #E76C08;
        // opacity: .5;
        border: 2px solid white;
        position: absolute;
        top: 1.2rem;
        left: 1.5rem;
    }
}

main{
    width: 100vw;
    // height: 2.5rem;
    background-color: #fff;
    margin-top: .1rem;
    font-size: .14rem;
    ul{
        display: flex;
        flex-direction: column;
        li{
            width: 85vw;
            height: .5rem;
            margin: 0 auto;
            line-height: .5rem;
            box-sizing: border-box;
            padding-left: .35rem;
            position: relative;
            border-bottom: 1px solid gray;
            img{
                width: .08rem;
                position: absolute;
                top: .15rem;
                right: 0;
            }
        }
        li:nth-child(1){
            background-image: url(../image/my/icon1.png);
            background-repeat: no-repeat;
            background-size: .2rem;
            background-position: .1rem .15rem;
        }
        li:nth-child(2){
            background-image: url(../image/my/icon2.png);
            background-repeat: no-repeat;
            background-size: .2rem;
            background-position: .1rem .15rem;
        }
        li:nth-child(3){
            background-image: url(../image/my/icon3.png);
            background-repeat: no-repeat;
            background-size: .2rem;
            background-position: .1rem .15rem;
        }
        li:nth-child(4){
            background-image: url(../image/my/icon4.png);
            background-repeat: no-repeat;
            background-size: .2rem;
            background-position: .1rem .15rem;
            border: 0;
        }
    }
}